﻿@{
    ViewBag.Title = "角色添加";
    Layout = null;
}

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>角色添加</title>
    <!-- 请勿在项目正式环境中引用该 layui.css 地址 -->
    <link href="//unpkg.com/layui@2.10.1/dist/css/layui.css" rel="stylesheet">
    <style>
        .demo-login-container {
            width: 320px;
            margin: 50px auto 0;
            border: 1px solid #e6e6e6;
            padding: 20px;
            border-radius: 5px;
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
        }

            .demo-login-container h2 {
                text-align: center;
                margin-bottom: 20px;
            }

        .layui-form-item {
            margin-bottom: 15px;
        }

        .demo-login-other.layui-icon {
            position: relative;
            display: inline-block;
            margin: 0 2px;
            top: 2px;
            font-size: 26px;
        }

        /* 清除浮动 */
        .clearfix:after {
            content: "";
            display: table;
            clear: both;
        }
    </style>
</head>

<body>
    <form class="layui-form">
        <div class="demo-login-container">
            <h2>添加角色</h2>
            <div class="layui-form-item">
                <div class="layui-input-wrap">
                    <div class="layui-input-prefix">
                        <i class="layui-icon layui-icon-username"></i>
                    </div>
                    <input type="text" name="RoleName" value="" lay-verify="required" placeholder="请填写角色名称" lay-reqtext="请填写角色名称" autocomplete="off" class="layui-input" lay-affix="clear">
                </div>
            </div>
            <div class="layui-form-item">
                <span>状态</span>
                <input type="radio" name="IsDeleted" value="false" title="否" checked>
                <input type="radio" name="IsDeleted" value="true" title="是">
            </div>
            <div class="layui-form-item">
                <button class="layui-btn layui-btn-fluid" lay-submit lay-filter="login-submit">添加</button>
            </div>
        </div>
    </form>
    <!-- 请勿在项目正式环境中引用该 layui.js 地址 -->
    <script src="//unpkg.com/layui@2.10.1/dist/layui.js"></script>
    <script>
        layui.use(['form', 'layer', 'jquery'], function () {
            var form = layui.form;
            var layer = layui.layer;
            var $ = layui.jquery;
            // 提交事件
            form.on('submit(login-submit)', function (data) {
                var field = data.field; // 获取表单字段值
                var loadIndex = layer.load(2); // 显示加载中

                // 处理 IsDeleted 的值为布尔类型
                var isDeleted = field.IsDeleted === "true";

                // 发送Ajax请求（GET方式，与API文档一致）
                $.ajax({
                    url: 'https://localhost:7272/api/Message/AddRole',
                    //url: "@ViewBag.BaseUrl/T6/Message/AddRole",
                    type: 'post',
                    contentType: 'application/json', // 设置数据格式为 JSON
                    data: JSON.stringify({
                        RoleName: field.RoleName,
                        IsDeleted: isDeleted,
                        CreateTime: new Date(),
                        UpdateTime: new Date(),
                        CreateName: 'wdx',
                        UpdateName: 'wdx'
                    }),
                    dataType: 'json',
                    success: function (res) {
                        console.log(res)
                        layer.close(loadIndex); // 关闭加载中
                        if (res.code === 212) {
                            layer.msg(res.msg, { icon: 1 }, function () {
                                console.log('用户数据:', res);
                                // 跳转到角色显示页面
                                window.location.href = '@Url.Action("GetRole", "RBAC")';
                            });
                        } else {
                            layer.msg(res.msg || '添加失败', { icon: 2 });
                        }
                    },
                    error: function (xhr, status, error) {
                        layer.close(loadIndex); // 关闭加载中
                        layer.msg('请求失败: ' + error, { icon: 2 });
                    }
                });

                return false; // 阻止默认 form 跳转
            });
        });
    </script>
</body>

</html>